<!DOCTYPE html>
<?php
include('include/connexionBdd.php');
include('include/sql.php');
?>
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta name="keywords" content="" />
        <meta name="description" content="Marchaux Classic Freeride est l'évènement organisé par le MerkuroCrew - Association de Longboard en Franch-Comté." />
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <meta http-equiv="X-UA-Compatible" content="IE=9" />
        <title>MerkuroCrew - Marchaux</title>
        <link href='http://fonts.googleapis.com/css?family=Arvo' rel='stylesheet' type='text/css'/>
        <link type="text/css" rel="stylesheet" href="assets/jQuery/jquery-ui.css" />
        <link href="assets/css/style.css" rel="stylesheet" type="text/css" media="screen" />
        <link href="assets/jQuery/jquery-countdown/jquery.countdown.css" rel="stylesheet" type="text/css" media="screen" />
        <link rel="SHORTCUT ICON" href="../../assets/banniere/logo.ico"/>
        <script src="assets/jQuery/jquery.min.js" type="text/javascript"></script>
        <script src="assets/jQuery/jquery-ui.js"></script>
        <script src="assets/jQuery/function.js"></script>
        <script src="assets/jQuery/jquery-countdown/jquery.countdown.js" type="text/javascript" charset="utf-8"></script>
        <script src="assets/jQuery/jquery-countdown/script.js"></script>
        <script src="https://www.paypalobjects.com/js/external/paypal-button.min.js"></script>

        <script type="text/javascript">
            
           

            $(document).ready(function() {
                $(".menuItem")
                .mouseover(function() { 
                    var src = $(this).children('img').attr("src").match(/[^\.]+/) + "Hover.png";
                    $(this).children('img').attr("src", src);
                })
                .mouseout(function() {
                    var src = $(this).children('img').attr("src").replace("Hover.png", ".png");
                    $(this).children('img').attr("src", src);
                });
                
                $(function() {
                    $(".envoyer_mdp").click(function()
                    {
                        $("#erreur_form2").fadeIn(400).html('');
                        var email = $("#email_mdp").val();           
                        var urlenvoye = 'email='+ email;
                        if(email==='')
                        {
                            $("#erreur_form2").show();
                            $("#erreur_form2").fadeIn(400).html("<img class='vertical_image' src='assets/image/attention.png' width='30px' />&nbsp;&nbsp;Vous n'avez pas rentré votre adresse email");           
                        }

                        else

                        {
                            $("#erreur_form2").fadeIn(400).html("<img class='vertical_image' src='assets/image/loading2.gif' width='30px' />&nbsp;&nbsp;<span class='chargement_auth' style='color:green'>Chargement ...</span>");
                            $.ajax({
                                type: "POST",
                                url: "envoyer_mdp.php",
                                data: urlenvoye,
                                cache: false,
                                success: function(html){
                                    $("#erreur_form2").fadeIn(400).html("");
                                    $("#erreur_form2").append(html);
                                }
        
                            });
                        }return false;
                    }); });
            });

        </script>
    </head>
    <body>
        <div id="headerImage"> 
            <img class="imageHeader" src="assets/banniere/banniereMerkuro.jpg"  width="100%" height="130px"/>                        
            <div id="header">

                <img src="assets/banniere/bannierewebNew.png" width="550px" class="banniereMerkuro">
                    <?php if (isset($_SESSION['login']) && isset($_SESSION['pwd']) && isset($_SESSION['prenom']) && isset($_SESSION['nom'])) { ?>
                        <div class="deconnexion">
                            <img src="assets/image/deconnexion.png"> Déconnection
                        </div>
                    <?php } else { ?>
                        <a href="creation_compte.php">
                            <div class="inscriptionSite">
                                <img src="assets/image/inscriptionSite.png" height="30px"/></br>
                                Se créer un compte
                            </div>
                        </a>
                        <div class="connexion">
                            <img src="assets/image/user.png" height="30px"/></br>
                            Se connecter au site          
                        </div>

                    <?php } ?>
            </div>


        </div>
        <div id="menu">
            <ul>
                <li>
                    <a href="index.php">
                        <?php if (isset($page) && $page === 'accueil') {
                            ?>
                            <div class="menuItemCurrent">
                                <img src="assets/image/homeHover.png" width="40px"/></br>
                                ACCUEIL
                            </div> 

                        <?php } else { ?>
                            <div class="menuItem">
                                <img src="assets/image/home.png" width="40px"/></br>
                                ACCUEIL
                            </div>
                        <?php } ?>
                    </a>
                </li>
                <li>
                    <a href="inscription_marchaux.php">
                        <?php if (isset($page) && $page === 'inscription') {
                            ?>
                            <div class="menuItemCurrent">
                                <img src="assets/image/marchauxHover.png" width="40px"/></br>
                                INSCRIPTION MARCHAUX
                            </div>

                        <?php } else { ?>
                            <div class="menuItem">
                                <img src="assets/image/marchaux.png" width="40px"/></br>
                                INSCRIPTION MARCHAUX
                            </div>
                        <?php } ?>

                    </a>
                </li>
                <li>
                    <a href="photo.php">
                        <?php if (isset($page) && $page === 'photo') {
                            ?>
                            <div class="menuItemCurrent">
                                <img src="assets/image/cameraHover.png" width="40px"/></br>
                                PHOTOS
                            </div>
                        <?php } else { ?>
                            <div class="menuItem">                                 
                                <img src="assets/image/camera.png" width="40px"/></br>
                                PHOTOS 
                            </div>
                        <?php } ?>
                    </a>
                </li>
                <li>
                    <a href="shop.php">
                        <?php if (isset($page) && $page === 'shop') {
                            ?>
                            <div class="menuItemCurrent">
                                <img src="assets/image/shopHover.png" width="40px"/></br>
                                SHOP
                            </div>
                        <?php } else { ?>
                            <div class="menuItem">                                  
                                <img src="assets/image/shop.png" width="40px"/></br>
                                SHOP
                            </div>
                        <?php } ?>
                    </a>
                </li>
            </ul>

        </div>
        <!--        Boite de Dialog pour se logguer-->
        <div id="dialog-confirm-auth" title="Accéder à votre compte" style="display:none">
            <form method=post action="#">
                <span style="color:red">*</span><b>Adresse email : </b>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input class='input_commentaire2'type="text" name='email' id="email"  onClick="this.style.border='solid #F68B2E 1px'" onBlur="this.style.border='solid #C7C7C7 1px'"></input>&nbsp;&nbsp;<span id='chargement_form'></span></br></br>
                <span style="color:red">*</span><b>Mot de passe : </b>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input class='input_commentaire2' type="password" name='mdp' id="mdp"  onClick="this.style.border='solid #F68B2E 1px'" onBlur="this.style.border='solid #C7C7C7 1px'"/></br></br>  
                <input type="submit" class='identification' value="S'authentifier"/>
                <span class='mdp'>&nbsp;&nbsp; <a href='#' class="mdp_perdu">Mot de passe oublié ? </a></span></br>
                <span id="chargement_auth"></span></br>
                <div class="remember_me"><input type="checkbox" id="remember" name="remember"/>Se souvenir de moi ? </div>     
                <div id='erreur_form'></div>        
            </form>
        </div> 
        <!--        Boite de Dialog pour se déconnecter-->
        <div id="dialog-confirm-deco" title="Voulez-vous vous déconnecter ? " style="display:none"></div>

        <!-- Boite de Dialog pour le mot de passe perdu-->
        <div id="dialog-confirm-mdp" title="Mot de passe perdu ? " style="display:none">
            <span class="description_mdp">Un email vous sera envoyé afin de vous permettre de modifier votre mot de passe.</span></br></br>
            <form method="post" action="#">
                <span style="color:red">*</span><b>Adresse email : </b>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input class='input_commentaire2'type="text" name='email' id="email_mdp"  onClick="this.style.border='solid #F68B2E 1px'" onBlur="this.style.border='solid #C7C7C7 1px'"/>
                <input type="submit" class='envoyer_mdp' value="Confirmer"></br>
                    <span id='erreur_form2'></span>
            </form>
        </div>

